// 设计稿宽度（根据实际设计稿尺寸调整）
const DESIGN_WIDTH = 1920;
// 设计稿中1rem对应的px值
const BASE_FONT_SIZE = 80;
// 最小/最大字体限制（避免极端屏幕尺寸问题）
const MIN_FONT_SIZE = 60;
const MAX_FONT_SIZE = 140;

/**
 * 初始化rem单位
 * 动态计算html根元素的font-size
 */
export function setupRem() {
    // 计算当前屏幕对应的根字体大小
    function calculateRem() {
        const screenWidth = window.innerWidth;
        // 按屏幕宽度与设计稿的比例计算
        let fontSize = (screenWidth / DESIGN_WIDTH) * BASE_FONT_SIZE;
        // 限制在最小和最大值之间
        fontSize = Math.max(Math.min(fontSize, MAX_FONT_SIZE), MIN_FONT_SIZE);
        // 设置根元素字体大小
        document.documentElement.style.fontSize = `${fontSize}px`;
    }

    // 初始化时执行一次
    calculateRem();
    // 监听窗口大小变化时重新计算
    window.addEventListener('resize', calculateRem);
    // 监听屏幕旋转（如平板横屏/竖屏切换）
    window.addEventListener('orientationchange', calculateRem);

    // 组件卸载时移除事件监听（可选）
    return () => {
        window.removeEventListener('resize', calculateRem);
        window.removeEventListener('orientationchange', calculateRem);
    };
}